import Vue from "vue";
import VueRouter from "vue-router";

// 大Vue使用大VueRouter
Vue.use(VueRouter);
import Home from "@/pages/Home/index.vue";
import Login from "@/pages/Login/index.vue";
import Register from "@/pages/Register/index.vue";
import Search from "@/pages/Search/index.vue";
//  封装vueRouter 实例
let originPush = VueRouter.prototype.push;
let originReplace = VueRouter.prototype.replace;

    VueRouter.prototype.push = function(location,resolve,reject){
        if (resolve && reject){
            console.log(this)
        //    这里的this指向组件实例，originPush()指向window,所以要用call(this)来指定连接上下文
            originPush.call(this,location,resolve,reject)
        }else{
            originPush.call(this,location,()=>{},()=>{})
        }
    }
    VueRouter.prototype.replace = function(location,resolve,reject){
        if (resolve && reject){
            console.log(this)
            //    这里的this指向组件实例，originPush()指向window,所以要用call(this)来指定连接上下文
            originReplace.call(this,location,resolve,reject)
        }else{
            originReplace.call(this,location,()=>{},()=>{})
        }
    }

export default new VueRouter({
    routes:[
        // {
        //     path:"/",
        //     component:
        // },
        {
            path:"/",
            component:Home,
            meta:{
                show:true
            }
        },
        {
            path:"/",
            redirect:"/",
            meta:{
                show:true
            }
        },
        {
            path:"/login",
            component:Login,
            meta:{
                show:false
            }
        },
        {
            path:"/register",
            component:Register,
            meta:{
                show:false
            }
        },
        {
            //加上问号可以指定params可传可不传.
            path:"/search/:keyword?",
            component:Search,
            meta:{
                show:true
            },
            name:"search",
            //第一种
            // props:true,
            // 第二种
            // props:{
            //     a:1,b:2
            // }
            // 第三种
            // 把拿到的参数由路由结构
            props:($route)=>({keyword:$route.params.keyword,q:$route.query.q})

        },
    ]
})